{% extends 'admin/base.html' %}
{% block title %}电影数据预览{% endblock %}
{% block content %}
    <div class="grid grid-cols-2 sm:grid-cols-3 lg:grid-cols-4 xl:grid-cols-5 gap-2 transition-all duration-500">
        {% if movie_data %}
            {% if movie_data.items | length > 0 %}
                {% for i in movie_data.items %}
                    <div class="card group h-80 image-full overflow-hidden before:transition-all before:duration-500 before:h-0 hover:before:h-full hover:before:delay-100">
                        <figure>
                            <img src="{{ url_for('static', filename=i.img_url ) }}"
                                 class="w-full object-cover group-hover:scale-105 transition-all duration-500 group-hover:scale-105"
                                 alt="Shoes"/>
                        </figure>
                        <div class="card-body p-3 justify-end scale-0 transition-all origin-top duration-500 group-hover:scale-100 group-hover:delay-100">
                            <div class="underline_ font-bold text-xl md:text-lg flex justify-between">
                                <span>{{ i.title }}</span>
                                <span>{{ i.score }}</span>
                            </div>
                            <div class="text-sm md:text-base">导演：{{ i.director }}</div>
                            <div class="text-sm md:text-base">片长：{{ i.film_length }}分钟</div>
                            <div class="text-sm md:text-base">分类：{{ i.movie_type }}</div>
                            <div class="text-sm md:text-base">评论人数：{{ i.people_num }}人</div>

                            <div class="card-actions justify-end">
                                <a class="btn btn-sm btn-ghost" href="{{ i.info_url }}" target="_blank">详情</a>
                            </div>
                        </div>
                    </div>
                {% endfor %}
            {% else %}
                <div>暂无数据</div>
            {% endif %}
        {% else %}
            <div class="text-center text-white">暂无数据</div>
        {% endif %}
    </div>

    {% if movie_data %}
        {% if movie_data.pages > 1 %}
            <div class="join flex justify-center items-center mt-3">
                {% if movie_data.has_prev %}
                    <a class="join-item btn" href="{{ url_for('admin.index', page=movie_data.prev_num) }}">«</a>
                {% else %}
                    <a class="join-item btn" disabled>«</a>
                {% endif %}
                <button class="join-item btn">{{ movie_data.page }} / {{ movie_data.pages }}</button>
                <button class="join-item btn">数据量：{{ movie_data.total }} 条</button>
                {% if movie_data.has_next %}
                    <a class="join-item btn" href="{{ url_for('admin.index', page=movie_data.next_num) }}">»</a>
                {% else %}
                    <a class="join-item btn" disabled>»</a>
                {% endif %}
            </div>
        {% endif %}
    {% endif %}
{% endblock %}